<template>
    <div class="list-common-tab">
      <el-row :gutter="20">
        <el-col :span="18">
          <!-- <el-input
            v-model="search"
            placeholder="请选择问卷"
            @keyup.enter="handleSearch"
            input-style="padding-right:30px"
          ></el-input> -->
        </el-col>
        <el-col :span="6" class="operation-container">
          <!-- <el-button type="primary" @click="handleSearch">检索</el-button>
          <el-button type="info" @click="handleClear">清空</el-button> -->
          <el-button type="primary" @click="exportData">导出</el-button>
          <div v-if="isExporting">
            <p>正在导出数据，请稍候...</p>
            <progress :value="progress" max="100"></progress>
          </div>
          <p v-if="errorMessage">{{ errorMessage }}</p>
        </el-col>
      </el-row>
      <div class="star-table-container">
        <el-table
          :data="questionReplyList"
          :stripe="stripe"
        >
          <!-- <el-table-column prop="id" label="问卷名称" /> -->
          <el-table-column prop="q1" label="您对自治区整治形式主义为基层减负政策措施的实施成效如何评价" />
          <el-table-column prop="q2" label="您对身边的党员干部树立和践行正确政绩观，不搞“政绩工程”“形象工程”“面子工程”，把精力用在服务群众，解决实际问题上的总体情况如何评价？" />
          <el-table-column prop="q3" label="您对党政机关事业单位精简文件会议数量，提升文件质量、会议效率的成效如何评价？" />
          <el-table-column prop="q4" label="您对党政机关事业单位严控面向基层的督查检查数量，优化方式方法的成效如何评价？" />
          <el-table-column prop="q5" label="您对党政机关事业单位解决调研集中扎堆、只调不研、干扰基层正常工作等问题的成效如何评价？" />
          <el-table-column prop="q6" label="您对党政机关事业单位纠治滥用微信群、钉钉群、APP打卡接龙、考核排名等问题的成效如何评价？" />
          <el-table-column prop="q7" label="您对乡村振兴中因地制宜、实事求是，不搞简单“一刀切”，防止“穷折腾”、搞“花架子”的成效如何评价？" />
          <el-table-column prop="q8" label="您对严格规范涉企行政检查，切实为企业减负的成效如何评价？" />
          <el-table-column prop="q9" label="您对纠治基层公务政务活动中过度使用短视频、电子演示文稿等加重基层负担行为的成效如何评价？" />
          <el-table-column prop="q10" label="您对规范社会事务进校园，减轻教师非教育教学任务负担，确保正常教学秩序的成效如何评价？" />
          <el-table-column prop="q11" label="您对清理规范过多过滥、测评体系繁杂的创建示范和达标活动的成效如何评价？" />
          <el-table-column prop="q12" label="您对党政机关事业单位落实健全规范管理制度，严控借调干部的成效如何评价？" />
          <el-table-column prop="q13" label="您对党政机关事业单位清理规范缺乏实效、浪费资金、名不符实、违反规定的节庆、论坛、展会的成效如何评价？" />
          <el-table-column prop="q14" label="您对党政机关事业单位完善考核办法，优化考核体系指标方式，从考“材料”、查“痕迹”转变为考成效、看“潜绩”，使干部将更多精力用到抓落实上的成效如何评价？" />
          <el-table-column prop="q15" label="您对清理村级组织“滥挂牌”问题（指牌子数量多、种类多、形式多、虚名多，增加基层负担、影响服务效率）的成效如何评价？" />
          <el-table-column prop="q16" label="您对纠治基层多头重复填表格、报数据、交材料的成效如何评价？" />
          <el-table-column prop="q17" label="您对规范明晰基层权责事项的实施情况如何评价？" />
          <el-table-column prop="q18" label="您对落实“三个区分开来”，防止问责泛化简单化的实施情况如何评价？" />
          <el-table-column prop="q19" label="您对关爱基层干部，带薪休假等政策措施的实施情况如何评价？" />
          <el-table-column prop="q20" label="您认为形式主义加重基层负担问题严重的领域主要是？" />
          <el-table-column prop="q21" label="您对解决身边的形式主义突出问题，切实减轻基层无谓的负担是否充满信心？" />
          <el-table-column prop="q22" label="您觉得当前身边突出的形式主义做法加重基层负担的问题有哪些？" />
          <el-table-column prop="q23" label="您对下一步整治形式主义为基层减负工作的建议是什么？" />
          <el-table-column prop="q24" label="您所在行政区?" />
          <el-table-column prop="q25" label="您的职业?" />
          <el-table-column prop="createDate" label="创建时间" />
          <el-table-column prop="location" label="地址位置" />
        </el-table>
      </div>
      <div class="star-table-pagination">
        <el-pagination
          background
          :total="listTotal"
          :layout="pageOperate"
          :default-page-size="size"
          :page-sizes="listPageSizes"
          v-model:page-size="pageSize"
          @size-change="handleSizeChange"
          v-model:current-page="currentPage"
          @current-change="handleCurrentChange"
        ></el-pagination>
      </div>
    </div>
  </template>

<script setup>
import { ElMessage } from 'element-plus'
import { ref, onMounted, watch, computed } from 'vue'
import { stripe, size, pageOperate, listPageSizes } from '@/config/list'
import { loadQuestionListByConfigId } from '@/api/business/questionscommon/list/QuestionList'
import axios from 'axios'
import { BASE_URL, BASE_PREFIX } from '@/config/constants'

import '@/style/list.less'

const search = ref('')
const questionReplyList = ref([])
const listTotal = ref(0)
const pageSize = ref(size)
const currentPage = ref(1)
const emit = defineEmits(['change-data'])
const props = defineProps({ fid: String, unitId: String })
const isExporting = ref(false)
const progress = ref(0)
const errorMessage = ref('')

const handleSearch = () => {
  currentPage.value = 1
  loadListData()
}

const handleClear = () => {
  currentPage.value = 1
  search.value = ''
  loadListData()
}

const exportData = async () => {
  isExporting.value = true
  try {
    const response = await axios.get(BASE_URL + BASE_PREFIX + '/common/publish/export', {
      responseType: 'blob'
    })
    const url = window.URL.createObjectURL(new Blob([response.data]))
    const link = document.createElement('a')
    link.href = url
    link.setAttribute('download', 'data.csv')
    document.body.appendChild(link)
    link.click()
    document.body.removeChild(link)
  } catch (error) {
    errorMessage.value = '导出数据失败，请稍后重试。'
  } finally {
    isExporting.value = false
    progress.value = 0
  }
}

const reloadData = () => {
  loadListData()
  emit('change-data')
}

const loadListData = () => {
  loadQuestionListByConfigId({
    current: currentPage.value,
    pageSize: pageSize.value,
    search: search.value
  }).then(data => {
    console.log(data)
    const { total, list } = data
    listTotal.value = total
    questionReplyList.value = list
  })
}

const handleSizeChange = () => {
  loadListData()
}

const handleCurrentChange = () => {
  loadListData()
}

watch(
  () => props.fid,
  () => {
    currentPage.value = 1
    search.value = ''
    loadListData()
  }
)

onMounted(() => {
  loadListData()
})
</script>
